import React, {Component} from 'react';
import BetterScroll from 'better-scroll'
import "./css/05.css"

class State
    extends Component {
    state = {
        list: []
    }

    render() {
        return (
            <div>
                <button onClick={this.getData.bind(this)}>click</button>
                <div className="kerwinwrapper" style={{height: '200px', background: 'yellow', overflow: 'hidden'}}>
                    <ul className="kerwincontent">
                        {
                            this.state.list.map(item =>
                                <li key={item}>{item}</li>
                            )
                        }
                    </ul>
                </div>
            </div>
        );
    }

    async getData() {
        console.log(this)
        let list = [1, 2, 3, 4, 5, 6, 7, 8, 9, 0, 11, 12, 13, 14, 15];

            await this.setState({
                list: list
            })

            console.log(this.state.list)
            console.log(document.querySelectorAll("li"))
            new BetterScroll(".kerwinwrapper")

}
}

export default State
;
